<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>FirstPage</title>
<link href="css/bootstrap.min.css" rel="stylesheet">
<script src="js/jquery-1.11.1.min.js"></script>
<script src="js/bootstrap.min.js"></script>
<script src="js/welcome/welcome.js"></script>
<script src="js/sweet-alert.min.js"></script>
<link rel="stylesheet" type="text/css" href="css/bootstrap.sweetalert/sweet-alert.css">
<style>
        .carousel {
            height: 500px;
        }

        .carousel .item {
            height: 500px;
        }

        .carousel .item img {
            width: 100%;
            height:100%
        }
    li{
        list-style: none;
    }
    .hrClass{
        margin:50px 0;
    }
</style>
</head>
<body>
	<nav class="navbar navbar-inverse navbar-fixed-top">
        <div class="container-fluid">
            <div class="navbar-header">
            
                <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar"
                        aria-expanded="false" aria-controls="navbar">
                    <span class="sr-only">Toggle navigation</span> <span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span>
                </button>
                <a class="navbar-brand" href="showMerchants">CSystem</a>
            </div>
            <div id="navbar" class="collapse navbar-collapse">
                
                <form class="navbar-form navbar-left">
                    <div class="form-group">
                      <input type="text" class="form-control" placeholder="店家搜索" id="findMerchantText">
                    </div>
                    
                </form>
                <ul class="nav navbar-nav navbar-right">
                    <c:if test="${sessionScope.cid!=null}"> 
                    <li class="dropdown">
                        <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button"
                           aria-expanded="false"><i class="fa fa-user fa-fw"></i>&nbsp;${sessionScope.cname }&nbsp;<span class="caret"></span></a>
                        <ul class="dropdown-menu" role="menu">
                            <li><a href="toorderlist">订单列表</a></li>
							<li><a href="toaddress">配送地址管理</a></li>
							<li><a href="tologout">退出登录</a></li>
                            
                        </ul>
                    </li>
                    </c:if>
                     <c:if test="${sessionScope.cid==null}">
                    	<ul class="nav navbar-nav">
		                    <li><a href="login.jsp">登录</a></li>
		                    <li><a href="register.jsp">注册</a></li>
		                </ul>
                    </c:if>
                </ul>
            </div>
        </div>
    </nav>    
    
    <div id="carousel-example-generic" class="carousel slide" data-ride="carousel">
        <ol class="carousel-indicators" id="adHookOl">
        </ol>
		
        <div class="carousel-inner" role="listbox" id="adHook">
        	
            
        </div>

        <a class="left carousel-control" href="#carousel-example-generic" role="button" data-slide="prev">
            <span class="glyphicon glyphicon-chevron-left"></span>
            <span class="sr-only">Previous</span>
        </a>
        <a class="right carousel-control" href="#carousel-example-generic" role="button" data-slide="next">
            <span class="glyphicon glyphicon-chevron-right"></span>
            <span class="sr-only">Next</span>
        </a>
    </div>
    
    <div class="container">
        <div class="col-sm-9 col-sm-offset-3 col-md-10 col-md-offset-2 main" style="margin-top: 50px;width: 70%">
            <!-- 克隆模板 -->
              	<div class="col-md-4" id="merchantTemplate" style="display:none">
					<li><img class="img-circle mimgTempl" src="x" /></li>
	                <li style="margin-left:50px" class="mnameTempl">店名</li>
					<button class="btn btn btn-success merchantBtn" style="margin-left:25px" icnum="xx">进入商家</button>
				</div>
            
            <div class="row" id="merchantId">
            	<c:forEach items="${merchants }" var="merchant">
	                <div class="col-md-3">
	                   			 
								<li><img width="200px" height="200px"  class="img-circle" src="${merchant.portrait }" /></li>
				                <li style="margin-left:50px">${merchant.mname } </li>
				                <li><a href="toCartPage?icnum=${merchant.icnum }"><button style="margin-left:40px" class="detail btn btn-success">进入商家</button></a></li>
				     </div>
			     </c:forEach>
            <hr class="hrClass">
        </div>
        
        
        
        
        
    </div>
    <!-- <button id="test">teststst</button>
    <button id="test2">test2</button>
    <script type="text/javascript">
    
    $(function(){
    	$("#test").on("click",function(){
    		swal({
			  title: "HTML <small>Title</small>!",
			  text: "A custom <span style='color:#F8BB86'>html<span> message.",
			  html: true
			});
    	});
    	$("#test2").click(function(){
    		alert("sssss");
    	})
    	
    });
    
    </script> -->
</body>
</html>